<script setup>
import {nextTick, onMounted, ref} from "vue";
import {currentUser} from "@/App.vue";
import qs from "qs";
import axios from "axios";
import request from "@/assets/js/mobileRequest";
const active = ref(0);

const userInfo = ref({
  username:'test',
  description:'吾心吾行澄如明镜，所作所为皆是正义。吾心吾行澄如明镜，所作所为皆是正义。',
  level: 10,
  gender: '男',
  avatarImgUrl:'',
  userId:''
});



let pageSize = 10;

let allStart = 1;

let start = 1;
let start1 = 1;
let start2 = 1;
let start3 = 1;
let start4 = 1;
let start5 = 1;
let start6 = 1;

const orderSelect = ref({
    userId:'',
    orderStatus:'',
    start:'',
    pageSize:''
})

let type = '';

const orderList = ref([]);
const orderList1 = ref([]);
const orderList2 = ref([]);
const orderList3 = ref([]);
const orderList4 = ref([]);
const orderList5 = ref([]);
const orderList6 = ref([]);

const onClickTab = ({ title }) => {
  console.log(title);
  if(title === '全部订单'){
    allStart = start;
  }else if(title === '待接单'){
    if(start1 === 1)
    {
      allStart = 1;
      loginOrder(title);
      start1++;
    }
    allStart = start1;
  }else if(title === '进行中'){
    if(start2 === 1)
    {
      allStart = 1;
      loginOrder(title);
      start2++;
    }
    start2++;
  }else if(title === '待评价'){
    if(start3 === 1)
    {
      allStart = 1;
      loginOrder(title);
      start3++;
    }
    start3++;
  }else if(title === '已完成'){
    if(start4 === 1)
    {
      allStart = 1;
      loginOrder(title);
      start4++;
    }
    start4++;
  }else if(title === '异常订单'){
    if(start5 === 1)
    {
      allStart = 1;
      loginOrder(title);
      start5++;
    }
    start5++;
  }else if(title === '未支付'){
    if(start6 === 1)
    {
      allStart = 1;
      loginOrder(title);
      start6++;
    }
    start6++;
  }
  type = title;
}

const loginOrder = (type)=>{
  orderSelect.value.userId = userInfo.value.userId;
  orderSelect.value.orderStatus = type;
  orderSelect.value.start = allStart;
  orderSelect.value.pageSize = pageSize;
  let data = qs.stringify(orderSelect.value);
  console.log(orderSelect.value);
  request.post(BASE_URL + "/v1/order/selectLimit", data).then((response) => {
    console.log(response.data.code);
    if (response.data.code == 2000) {
      console.log(response.data.data);
      if(type === '待接单'){
        orderList1.value = response.data.data;
        orderImgSet(orderList1);
      }else if(type === '进行中'){
        orderList2.value = response.data.data;
        orderImgSet(orderList2);
      }else if(type === '待评价'){
        orderList3.value = response.data.data;
        orderImgSet(orderList3);
      }else if(type === '已完成'){
        orderList4.value = response.data.data;
        orderImgSet(orderList4);
      }else if(type === '异常订单'){
        orderList5.value = response.data.data;
        orderImgSet(orderList5);
      }else if(type === '未支付'){
        orderList6.value = response.data.data;
        orderImgSet(orderList6);
      }else{
        orderList.value = response.data.data;
        orderImgSet(orderList);
      }

      /*console.log(orderList.value);*/
    }
  })
}

const orderImgSet = (list)=>{
  let len = list.value.length;
  for(var i = 0;i < len;i++){
    if(list.value[i].orderType == '拿外卖'){
      list.value[i].orderImg = '/food.png';
    }else if(list.value[i].orderType == '打饭'){
      list.value[i].orderImg = '/hungry.png';
    }else if(list.value[i].orderType == '送厕纸'){
      list.value[i].orderImg = '/wc.png';0
    }else if(list.value[i].orderType == '拿快递'){
      list.value[i].orderImg = '/express delivery.png';
    }else if(list.value[i].orderType == '跑腿'){
      list.value[i].orderImg = '/runleg.png';
    }else{
      list.value[i].orderImg = '/runleg.jpg';
    }
}
}

const thisCard = ref({});

onMounted(() => {
  nextTick(() => {
    userInfo.value = currentUser.value;
    console.log(userInfo.value);
    loginOrder();
    start++;
  })

})
</script>

<template>
  <van-tabs v-model:active="active" animated style="height: 100%" @click-tab="onClickTab">
    <van-tab title="全部订单" @click-tab="onClickTab">
      <div style="height: 85vh;overflow-y: scroll">
        <router-link :to="'/card?orderId='+thisCard.orderId">
          <van-card v-for="num in orderList"
              :price="num.orderPrice"
              :desc="num.orderDescription"
              :title="num.orderTitle"
              :thumb="num.orderImg"
              @click="thisCard = num"
          />
        </router-link>
      </div>
    </van-tab>
    <van-tab title="未支付">
    <div style="height: 85vh;overflow-y: scroll">
      <router-link :to="'/card?orderId='+thisCard.orderId">
        <van-card v-for="num in orderList6"
                  :price="num.orderPrice"
                  :desc="num.orderDescription"
                  :title="num.orderTitle"
                  :thumb="num.orderImg"
                  @click="thisCard = num"
        />
      </router-link>
    </div>
  </van-tab>
    <van-tab title="待接单">
      <div style="height: 85vh;overflow-y: scroll">
        <router-link :to="'/card?orderId='+thisCard.orderId">
          <van-card v-for="num in orderList1"
                    :price="num.orderPrice"
                    :desc="num.orderDescription"
                    :title="num.orderTitle"
                    :thumb="num.orderImg"
                    @click="thisCard = num"
          />
        </router-link>
      </div>
    </van-tab>

    <van-tab title="进行中">
      <div style="height: 85vh;overflow-y: scroll">
        <router-link :to="'/card?orderId='+thisCard.orderId">
          <van-card v-for="num in orderList2"
                    :price="num.orderPrice"
                    :desc="num.orderDescription"
                    :title="num.orderTitle"
                    :thumb="num.orderImg"
                    @click="thisCard = num"
          />
        </router-link>
      </div>
    </van-tab>
    <van-tab title="待评价">
      <div style="height: 85vh;overflow-y: scroll">
        <router-link :to="'/card?orderId='+thisCard.orderId">
          <van-card v-for="num in orderList3"
                    :price="num.orderPrice"
                    :desc="num.orderDescription"
                    :title="num.orderTitle"
                    :thumb="num.orderImg"
                    @click="thisCard = num"
          />
        </router-link>
      </div>
    </van-tab>
    <van-tab title="已完成">
      <div style="height: 85vh;overflow-y: scroll">
        <router-link :to="'/card?orderId='+thisCard.orderId">
          <van-card v-for="num in orderList4"
                    :price="num.orderPrice"
                    :desc="num.orderDescription"
                    :title="num.orderTitle"
                    :thumb="num.orderImg"
                    @click="thisCard = num"
          />
        </router-link>
      </div>
    </van-tab>
    <van-tab title="异常订单">
      <div style="height: 85vh;overflow-y: scroll">
        <router-link :to="'/card?orderId='+thisCard.orderId">
          <van-card v-for="num in orderList5"
                    :price="num.orderPrice"
                    :desc="num.orderDescription"
                    :title="num.orderTitle"
                    :thumb="num.orderImg"
                    @click="thisCard = num"
          />
        </router-link>
      </div>
    </van-tab>
  </van-tabs>
</template>

<style scoped>

</style>